(function($)
{
	function logger( event, ui ) {
		var action = ui.item[0].attributes['action'].nodeValue;
		if (action != undefined) {
			actionsCaller[action]();
		}
	};

    $.fn.actionMenu=function(parametres)
    {
		var myId = this[0].id;
		var myDiv =$( "#"+myId );

		if ($("#menu").size() == 0)
		{
			myDiv.css("display", "none");
		} else {
			myDiv.css("display", "block");
			$("body").click(function(e){			
	    		var clicked = e.target;
				var closeContextMenu = true;
				for (var i=0; i<3 && clicked != undefined; i++) {
					if (myId == clicked.id) {
						closeContextMenu = false;
						break;
	        		}
					clicked = clicked.parentElement;
				}
				
				if (closeContextMenu)
					$( "#menu" ).slideUp();

			});
			
			$( "#menu" ).menu({ select: logger }).hide();
			
			$('#'+myId).bind('click', function(e) {
				$( "#menu" ).slideToggle( "slow" );
			});
			
			$( "#menu" ).position({
					of: myDiv,
					my: "left bottom",
					at: "left top",
					collision: "flip flip"
				});			
		}
			
		return this;
    };
	
	 var name = $( "#name" ),
      desc = $( "#desc" ),
      allFields = $( [] ).add( name ).add( desc ),
	  tips = $( ".validateTips" );
	  
    function updateTips( t ) {
      tips
        .text( t )
        .addClass( "ui-state-highlight" );
      setTimeout(function() {
        tips.removeClass( "ui-state-highlight", 1500 );
      }, 500 );
    }
 
    function checkLength( o, n, min, max ) {
      if ( o.val().length > max || o.val().length < min ) {
        o.addClass( "ui-state-error" );
        updateTips( "Length of " + n + " must be between " +
          min + " and " + max + "." );
        return false;
      } else {
        return true;
      }
    }
	
	var actionsCaller = {	
		createPage : function() {
			
			var dlg = alias.createModalPopup("Ajouter une nouvelle page");
			dlg.html(
'<form> \
 	<p class="validateTips">All form fields are required.</p> \
	<fieldset class="dialogBox"> \
		<label for="name">Nom de la page</label> \
		<input type="text" name="name" id="name" class="text ui-widget-content ui-corner-all" /> \
		<label for="desc">Description</label>  \
		<input type="text" name="desc" id="desc" value="" class="text ui-widget-content ui-corner-all" />   \
	</fieldset> \
</form>');
			dlg.dialog({
		      buttons: {
		        "Ajouter la page": function() {
		          var bValid = true;
		        //  allFields.removeClass( "ui-state-error" );
		 
		          bValid = bValid && checkLength( $('#name'), "name", 3, 50 );
		          bValid = bValid && checkLength( $('#desc'), "desc", 6, 200 );
		 
		          if ( bValid ) {
		            alert ($('#name').val() + " - " + $('#desc').val());
		            $( this ).dialog( "close" );
		          }
		        },
		        Cancel: function() {
		          $( this ).dialog( "close" );
		        }
		      },
		      close: function() {
		       // allFields.val( "" ).removeClass( "ui-state-error" );
		      }
		    });
			dlg.dialog("open");
		},
		editPage : function() {
			alert('Edition de la page');			
		}
		};
	
})(jQuery);